<template>
  <div>
    <h1>登录</h1>
    <!-- :value="user.username"是父传子事件 -->
    <!-- @input 是子传父事件 -->
    <myinput :value="user.username" @input="getinput"></myinput>
    <myinput v-model="user.password"></myinput>
    <mybutton type="success">登录</mybutton>
  </div>
</template>

<script>
import myinput from "./myinput.vue";
import mybutton from "./mybutton.vue";
import Mybutton from "./mybutton.vue";
export default {
  components: {
    myinput,
    Mybutton,
  },
  data() {
    return {
      user: {
        username: "jack",
        password: "321",
      },
    };
  },
  methods: {
    getinput(data) {
      this.user.username = data;
    },
  },
};
</script>

<style lang="less" scoped>
h1 {
  text-align: center;
  margin: 20px auto;
}
</style>